<template>
  <a-modal
    v-model:visible="visible"
    title="支付订单详情"
    :width="500"
    :footer="null"
  >
    <a-descriptions title="" :column="1">
      <a-descriptions-item label="订单号">{{ data.orderNo }}</a-descriptions-item>
      <a-descriptions-item label="订单状态">{{ data.status == 0 ? '待支付' : '支付成功' }}</a-descriptions-item>
      <a-descriptions-item label="订单生成时间">{{
        data.createTime
      }}</a-descriptions-item>
      <a-descriptions-item label="门店号">{{ data.shopNo }}</a-descriptions-item>
      <a-descriptions-item label="门店名">{{ data.shopName }}</a-descriptions-item>
      <a-descriptions-item label="支付方式">微信支付</a-descriptions-item>
      <a-descriptions-item label="支付时间">{{ data.payTime }}</a-descriptions-item>
    </a-descriptions>
  </a-modal>
</template>

<script setup>
const props = defineProps({
  data: {
    type: Object,
    default: () => ({}),
  },
});
const visible = ref(false)
defineExpose({
  visible,
});
</script>

<style lang="less" scoped>
.list-box {
  display: flex;
  border: 1px solid #ececec;
  .list {
    width: 20%;
    &:not(:last-child) {
      border-right: 1px solid #ececec;
    }
  }
  .date,
  .count-list {
    height: 32px;
    line-height: 32px;
    text-align: center;
    border-bottom: 1px solid #ececec;
  }
}
</style>
